/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : Mar 30, 2015, 6:43:47 AM
    Author     : Ken
*/


body{
    width: 960px;
    margin: 0 auto;
    background-color: rgb(224, 255, 255);
}

header{
    height: 5%;
    text-align: center;
    margin-top: 2em;
}

#leftn{
    display: none;
    position: absolute;
    left: 0;
    top: 78px;
}

#leftdot{
    display: none;
    position: absolute;
    left: 0;
    top : 30px;
}

#rightn{
    display: none;
    position: absolute;
    right: 0;
    top: 78px;
}

#rightdot{
    display: none;
    position: absolute;
    right: 0;
    top: 30px;
}

footer{
    font-family: Tahoma, Geneva, sans-serif;
    text-align: center;
    height: 5%;
}

#content{
    width: 400px;
    box-shadow: 0 0 9px 0 rgba(0,0,0,3);
    margin: 100px auto;
}

#content form{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 20px;
}

#content form label{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 25px;
    background-color: cadetblue;
}

#content form input[type='password'], #content form input[type='text']{
    width: 310px;
    height: 25px;
    margin-bottom: 20px;
    padding: 0 15px;
}

#content form input[type='submit']{
    width: 100%;
    padding: 15px;
    margin-top: 20px;
    cursor: pointer;
    font-weight: bold;
    transition: background-color 0.2s;
}

#invalid {
    margin-top: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}